<template>
  <div class="booksServiceCon contain">
      <header class="boxShadow header">
            <Breadcrumb>
                <BreadcrumbItem to="/">
                    <Icon type="ios-pricetags" color='#2d8cf0' size="15"></Icon>
                   三方服务
                </BreadcrumbItem>
                <BreadcrumbItem to="/servicemg/booksrepurchase">二手书回购</BreadcrumbItem>
            </Breadcrumb>
            <Row type="flex" justify="start" >
                <Col :span="10">
                    发布时间 ：
                    <DatePicker type="datetimerange" format="yyyy-MM-dd HH:mm" @on-change="selectDate" :value="searchTime" placeholder="请选择日期" style="width: 260px" ></DatePicker>
                </Col>
                <Col>
                    学校 ：
                    <Select v-model="searchSchool" style="width:200px" placeholder="请选择学校" clearable  filterable>
                        <!-- <OptionGroup v-for="(item,index) in school" :label="item.area" > -->
                            <Option v-for="item1 in schoolList" :value="item1.id" :key="item1.id">{{ item1.campus }}</Option>
                        <!-- </OptionGroup> -->
                    </Select>
                    <Button type="primary" @click="searchSubmit">查询</Button>
                    <Button @click="searchReset" style="margin-left: 8px">重置</Button>
                </Col>
            </Row>
      </header>
      <section class="booksList outboxstyle">
            <header class="header">
                <Row type="flex" justify="space-between">
                    <Col>
                         <RadioGroup v-model="operateStatus"  @on-change="changeStatus" type="button">
                            <Radio :label="item" v-for="(item,index) in statusList" :key="item"></Radio>
                        </RadioGroup>
                    </Col>
                    <Col>
                        <Button @click="batchOperate">批量处理</Button>
                        <Button @click="exportOperate" type="primary" style="margin-left: 8px">导出</Button>
                    </Col>
                </Row>
          </header>
          <section class="tableWrap">
                <Table border height="400" ref="selection" stripe 
                        :loading="releaseLoading" 
                        @on-select-all="chooseAll"
                        @on-select="chooseOne"
                        :columns="bookTableHead"
                        :data="bookList">
                </Table>
                <Page class="pageRight pd30px" show-elevator show-sizer show-total
                    :page-szie-opts="[10,30,50,100]"
                    :total="totalCount" 
                    :current="currentPage"
                    @on-change="changePage"
                    @on-page-size-change="changePageSize" ></Page>
                    <Masklayer type='flower' :loaddingMask="loaddingMask"></Masklayer>
          </section>
      </section>
  </div>
</template>

<script>
    import {Api} from '../../libs/Api'
    import {GlobalFooter,Masklayer,Exception} from '@/components'
    import {formatDate} from '../../libs/date.js'
    export default{
        components:{GlobalFooter,Masklayer,Exception},
        data () {
            return{
                searchTime:'',
                searchSchool:'',
                schoolList:[],
                operateStatus:'全部',
                statusList:['全部','已处理','未处理'],
                releaseLoading:false,
                bookTableHead: [//表头
                    {
                        type: 'selection',
                        width: 60,
                        align: 'center'
                    },
                    {
                        title: '姓名',
                        key: 'id',
                        width:120,
                        align: 'center'
                    },
                    {
                        title: '联系电话',
                        key: 'telnum',
                        width:125,
                        align: 'center'
                    },
                    {
                        title: '发布时间',
                        key: 'time',
                        align: 'center',
                        sortable:true,
                    },
                    {
                        title: '学校',
                        key: 'school',
                        align: 'center',
                        ellipsis:true,
                    },
                    {
                        title: '地址',
                        key: 'address',
                        align: 'center',
                        ellipsis:true,
                    },
                    {
                        title: '书本数量',
                        key: 'num',
                        width:110,
                        align: 'center',
                        sortable:true
                    },
                    {
                        title: '状态',
                        key: 'status',
                        width:100,
                        align: 'center',
                    }
                ],
                bookList: [//二手书发布列表
                    {
                        name: 'John Brown',
                        telnum: 18965698947,
                        time:'2018-05-03',
                        school:'江苏大学',
                        address: 'New York No. 1 Lake Park',
                        num:'1',
                        status:'已处理'
                    }
                   ],
                totalCount:100,
                currentPage:1,
                pageSize:10,
                loaddingMask:false,
            }
        },
        mounted () {
             //初始化二手书回购列表
            let param={
                page:this.currentPage,
                limit:this.pageSize,
                sidx:'',
                order:''
            }
            this.loaddingMask=true;
            Api.service(param).then(res => {
                if(res.data.code=='0'){
                    this.totalCount=res.data.page.totalCount;
                    this.bookList=res.data.page.list;
                    setTimeout(res =>{this.loaddingMask=false},300);
                }else{
                    setTimeout(res1 =>{
                        this.loaddingMask=false,
                         this.$Message.info({
                            duration:1,
                            top:100,
                            content:res.data.msg
                        })
                    },300);
                }
            })
            //初始化学校
            Api.schoolList(1,10,'','').then(res =>{
               this.schoolList=res.data.page.list
            })
        },
        methods:{
            refreshBooksList(){
                let addtime1=new Date(this.searchTime[0]).getTime();
                let addtime2=new Date(this.searchTime[1]).getTime();
                let param={
                    page:this.currentPage,
                    limit:this.pageSize,
                    sidx:'',
                    order:'',
                    addtime1:addtime1,
                    addtime2:addtime2,
                    // school:this.searchSchool,
                    school:'',
                    // categoryIdList:this.checkAllGroup,
                    categoryIdList:[1036000,1008009],
                }
                if(this.searchTime==''){
                    param['addTime1']='';
                    param['addTime2']='';
                }
                this.loaddingMask=true;
                Api.service(param).then(res =>{
                    this.totalCount=res.data.page.totalCount;
                    this.bookList=res.data.page.list;
                    setTimeout(res=>{ this.loaddingMask=false;},300)
                })
            },
            //选择日期
            selectDate(date){
                this.searchTime=date;
            },
            formatDate(time) {
                    let date = new Date(time);
                    return formatDate(date, 'yyyy-MM-dd hh:mm');
                },
            //搜索提交
            searchSubmit(){

            },
            //搜索重置
            searchReset(){
                this.searchTime='';
                this.searchSchool='';
            },
            //批量处理
            batchOperate(){
                
            },
            //导出操作
            exportOperate(){

            },
            //改变列表选择状态（全部，已处理，未处理）
            changeStatus(){

            },
            //全选
            chooseAll(){

            },
            //多选
            chooseOne(){

            },
            //选择页数
            changePage(page){
                this.currentPage=page;
                this.refreshBooksList();
            },
            //选择每页多少条
            changePageSize(pageSize){
                this.pageSize=pageSize;
                this.refreshBooksList();
            }
        }
    }
</script>

<style lang="less">
    .booksServiceCon{
        .header{
            padding-bottom:12px;
            .ivu-select{margin-right:10px;}
            .ivu-btn{padding: 4px 15px;}
            .ivu-breadcrumb{
                margin-bottom:15px;
            }
        }
        .booksList{
            margin:15px;
            padding-top: 10px;
            header{
                .ivu-btn{padding: 4px 15px;}
            }
            .ivu-table-wrapper{
                // margin:0 20px;
            }
            .pageRight{
                padding:20px;
            }
        }
    }
</style>

